	var Intro = function(canvas){
	this.canvas = canvas;
	this.canvas.width = 750;
	this.canvas.height = 1450;
	this.images = images || {};
	this.ss = ss||{};
	this.exportRoot = null;
	this.stage = null;
	this.currIcon;
	this.init();
}
Intro.prototype = {
	init:function(){
		var manifest = [

		]
		var loader = new createjs.LoadQueue(false);
		loader.installPlugin(createjs.Sound);
		loader._self = this;
		loader.addEventListener("fileload", this.handleFileLoad);
		loader.addEventListener("complete", this.handleComplete);
        loader.addEventListener("progress", this.handleFileProgress);
		loader.loadFile({src:"images/intro_atlas_.json?1542783882932", type:"spritesheet", id:"intro_atlas_"}, true);
		loader.loadManifest(manifest);
	},
	handleFileLoad:function(evt){
		if (evt.item.type == "image") { this.images[evt.item.id] = evt.result; }
	},
	handleFileProgress:function(event){
		 var v = parseInt(event.loaded / event.total * 100);
		 var loader = event.target;
		 var _self = loader._self;
	},
	handleComplete:function(evt){
		var queue = evt.target;
		var _self = queue._self;
		var ss = _self.ss;
		
		ss["intro_atlas_"] = queue.getResult("intro_atlas_");

		_self.exportRoot = new lib.intro();
		_self.stage = new createjs.Stage(_self.canvas);
		_self.stage.addChild(_self.exportRoot);
		_self.stage.update();

		createjs.Ticker.setFPS(30);
		createjs.Touch.enable(_self.stage);
		_self.stage.enableMouseOver(10);
		_self.stage.mouseMoveOutside = true;
		
		createjs.Ticker.setFPS(30);
		createjs.Ticker.addEventListener("tick", _self.stage);

		_self.exportRoot.main.btn_skip.addEventListener('click', function(){
			var f = _self.exportRoot.main.totalFrames - 5;
			_self.exportRoot.main.gotoAndPlay(f);
			onSkip();
		});

		initMain();

	},
	onPlay:function(){
		var _self = this;
		createjs.Ticker.addEventListener("tick", _self.stage);
	},
	onStop:function(){
		var _self = this;
		createjs.Ticker.removeEventListener("tick", _self.stage);
	},


}






var DIY = function(canvas){
	this.canvas = canvas;
	this.canvas.width = 750;
	this.canvas.height = 1450;
	this.images = images || {};
	this.ss = ss||{};
	this.exportRoot = null;
	this.stage = null;
	this.loaded = false;
	this.currIcon;
	this.init();
}
DIY.prototype = {
	init:function(){
		var manifest = [

		]
		var loader = new createjs.LoadQueue(false);
		loader.installPlugin(createjs.Sound);
		loader._self = this;
		loader.addEventListener("fileload", this.handleFileLoad);
		loader.addEventListener("complete", this.handleComplete);
        loader.addEventListener("progress", this.handleFileProgress);
		loader.loadFile({src:"images/ugc_atlas_.json?1522208419386", type:"spritesheet", id:"ugc_atlas_"}, true);
		loader.loadManifest(manifest);
	},
	handleFileLoad:function(evt){
		if (evt.item.type == "image") { this.images[evt.item.id] = evt.result; }
	},
	handleFileProgress:function(event){
		 var v = parseInt(event.loaded / event.total * 100);
		 var loader = event.target;
		 var _self = loader._self;
	},
	handleComplete:function(evt){
		var queue = evt.target;
		var _self = queue._self;
		var ss = _self.ss;
		
		ss["ugc_atlas_"] = queue.getResult("ugc_atlas_");

		_self.exportRoot = new lib.ugc();
		_self.stage = new createjs.Stage(_self.canvas);
		_self.stage.addChild(_self.exportRoot);
		_self.stage.update();

		createjs.Ticker.setFPS(30);
		createjs.Touch.enable(_self.stage);
		_self.stage.enableMouseOver(10);
		_self.stage.mouseMoveOutside = true;
		
		createjs.Ticker.setFPS(30);
		createjs.Ticker.addEventListener("tick", _self.stage);

		_self.loaded = true;
		_self.exportRoot.qr.visible = false;
		_self.exportRoot.icon_cont.removeAllChildren();

	},
	onPlay:function(){
		createjs.Ticker.addEventListener("tick", this.stage);
	},
	onStop:function(){
		var _self = this;
		createjs.Ticker.removeEventListener("tick", this.stage);
	},
	addIcon: function(src, step, type){
		//console.log('src  = ' + src)

		var self = this;
		var icon_cont = self.exportRoot.icon_cont;
		var icon = new lib.icon();
		icon.x = 400;
		icon.y = 500;
		icon.alpha = 0;
		icon.type = type;
		icon.step = step;
		icon.src = src;
		icon_cont.addChild(icon);
		var mc = new createjs.Bitmap(src);
		setTimeout(function(){
			icon.img_mc.removeAllChildren();
			icon.img_mc.addChild(mc);
			icon.alpha = 1;

    		var rect = mc.getBounds();
			var scale = Math.min(250 / rect.width, 250 / rect.height);
			mc.scaleX = mc.scaleY = scale;
			mc.iw = Math.floor(rect.width * scale);
			mc.ih = Math.floor(rect.height * scale);
			mc.x = (250 - mc.iw) * 0.5;
			mc.y = (250 - mc.ih) * 0.5;

			icon.btn_close.addEventListener('mousedown', function(e){
				icon_cont.removeChild(e.currentTarget.parent);
			});

    	}, 200);

    	icon.btn_rotation.addEventListener('mousedown', function(e){
    		var _icon = e.currentTarget.parent;
	    	var img_mc = e.currentTarget.parent.img_mc;
	    	if(_icon.state == null) _icon.state = 1;
    		if(_icon.type == 'pop'){

    			var i = _icon.src.indexOf('.png');
    			var url = '';

    			if(_icon.state == 1){
    				//反
	    			var a = _icon.src.substr(0, i);
	    			url = a + '-fan.png';
	    			_icon.state = 2;
    				updateState(url);
    			}
    			else if(_icon.state == 2){
    				//正
    				_icon.state = 1;
    				updateState(_icon.src);
    			}
    			
    			updateState(url);
    			function updateState(d){
		    		var _mc = new createjs.Bitmap(d);
	    			var img = new Image();
	    			img.src = d;
	    			img.onload = function(){

		    			setTimeout(function(){
		    				
							img_mc.removeAllChildren();
							img_mc.addChild(_mc);

				    		var rect = _mc.getBounds();
							var scale = Math.min(250 / rect.width, 250 / rect.height);
							_mc.scaleX = _mc.scaleY = scale;
							_mc.iw = Math.floor(rect.width * scale);
							_mc.ih = Math.floor(rect.height * scale);
							_mc.x = (250 - _mc.iw) * 0.5;
							_mc.y = (250 - _mc.ih) * 0.5;

				    	}, 200);

	    			}
    			}

    		}
    		else{
				img_mc._scaleX = img_mc.scaleX * -1;
				TweenLite.to(img_mc, .2, {scaleX:img_mc._scaleX});
			}
		});

		icon.addEventListener('mousedown', function(e){
			
			//if(e.currentTarget.step == currStep){
				self.currIcon = e.currentTarget;
				self.resetHammerValue();
			//}

		});
		self.currIcon = icon;
		self.resetHammerValue();
	},
	resetHammerValue: function(){
		var self = this;
		hammer.resetTransform({
			x:self.currIcon.x,
			y:self.currIcon.y,
			scale:self.currIcon.scaleX,
			angle:self.currIcon.rotation,
		});

		var icon_cont = this.exportRoot.icon_cont;
		var len = icon_cont.numChildren;
		for(var i=0;i<len;i++){
			var icon = icon_cont.getChildAt(i);
			var type = icon_cont.getChildAt(i).type;
			//if(type == 'icon'){
				var btn_close = icon_cont.getChildAt(i).btn_close;
				var btn_rotation = icon_cont.getChildAt(i).btn_rotation;
				var line = icon_cont.getChildAt(i).line;
				btn_close.visible = false;
				btn_rotation.visible = false;
				line.visible = false;
			//}
			
			//icon.parent.setChildIndex( icon, icon.parent.numChildren - 1 );
		}

		if(self.currIcon.parent != null) self.currIcon.parent.setChildIndex ( self.currIcon,  self.currIcon.parent.numChildren - 1 );
		icon_cont.parent.setChildIndex ( icon_cont,  icon_cont.parent.numChildren - 1 );

		
		if(self.currIcon.lockScale == true) return;
		self.currIcon.btn_close.visible = true;
		self.currIcon.btn_rotation.visible = true;
		self.currIcon.line.visible = true;

		
	},
	updateTransform: function(transform){
		var self = this;
		self.currIcon.x = parseInt(transform.translate.x);
		self.currIcon.y = parseInt(transform.translate.y);

		if(self.currIcon.lockScale == true) return;
		self.currIcon.scaleX = self.currIcon.scaleY = transform.scale;
		self.currIcon.rotation = transform.angle;
	},
	changePosition:function(sex, positon, url){
		console.log('sex= ' + sex + '  positon= ' + positon + '  imgurl= ' + url);
		var self = this;
		var target = this.exportRoot[sex][positon];
		target.removeAllChildren();
		//切换图片
		var mc = new createjs.Bitmap(url);
		target.addChild(mc);
	},
	setbackground: function(url){
		var self = this;
		var mc = new createjs.Bitmap(url);
		setTimeout(function(){
			self.exportRoot.bg.removeAllChildren();
			self.exportRoot.bg.addChild(mc);
    	}, 200);
	},
	clean: function(){
		var self = this;
		var icon_cont = this.exportRoot.icon_cont;
		var len = icon_cont.numChildren;
		for(var i=0;i<len;i++){
			var type = icon_cont.getChildAt(i).type;
			var btn_close = icon_cont.getChildAt(i).btn_close;
			var btn_rotation = icon_cont.getChildAt(i).btn_rotation;
			var line = icon_cont.getChildAt(i).line;
			btn_close.visible = false;
			btn_rotation.visible = false;
			line.visible = false;
		}

	},
	removeAllIcon: function(){
		var self = this;
		var icon_cont = self.exportRoot.icon_cont;
		icon_cont.removeAllChildren();
	},
	setLogo: function(status){
		var self = this;
		if(self.loaded){
			var f = status == "black" ? 1 : 2;
			self.exportRoot.logo.gotoAndStop(f);
		}
	},
	removeClickEvent: function(){
		var self = this;
		var icon_cont = this.exportRoot.icon_cont;
		var len = icon_cont.numChildren;
		for(var i=0;i<len;i++){
			var icon = icon_cont.getChildAt(i);
			icon.removeAllEventListeners();
		}
	}
	

}




//-------------------------------------------------------------- 首页 ------------------------------------------------
var HammerEvent = function(target){
	this.mc;
	this.el;
	this.START_X = 0;
	this.START_Y = 0;
	this.transform = {};
	this.initAngle = 0;  //旋转角度
	this.initScale = 1;  //放大倍数
	this.preAngle =0 ;
	this.tempAngleFlag=0;
	this.deltaAngle = 0;
	this.startRotateAngle = 0;
	this.ticking = false;
	this.target = target;
	this.init();
}
HammerEvent.prototype = {
	init:function(){
		var self = this;
		self.transform = {
	        translate: { x: self.START_X, y: self.START_Y },
	        scale: 1,
	        angle: 0,
	        rx: 0,
	        ry: 0,
	        rz: 0
	    };

	    self.el = document.querySelector(self.target);

	    var mc = self.mc;
	    mc = new Hammer.Manager(self.el);   //用管理器  可以同时触发旋转 拖拽  移动
	    mc.element.self = self;
	    mc.add(new Hammer.Pan({ threshold: 0, pointers: 0 }));
		mc.add(new Hammer.Rotate({ threshold: 0 })).recognizeWith(mc.get('pan'));
		mc.add(new Hammer.Pinch({ threshold: 0 })).recognizeWith([mc.get('pan'), mc.get('rotate')]);
		//结束时做一些处理
		mc.on("hammer.input", function(ev) {
		    if(ev.isFinal) {
		        if(self.transform){
		            self.START_X = self.transform.translate.x ;
		            self.START_Y = self.transform.translate.y ;
		        }

		    }

		});
		mc.on("panstart panmove", self.onPan);
		mc.on("pinchstart pinchmove", self.onPinch);
		mc.on("rotatestart rotatemove rotateend", self.onRotate);
		/* 第二次进入拖拽时  delta位移重置  移动时 初始位置startxy不动。delta增加 */
		
	},
	onPan: function(ev){
		var self = ev.target.self;
	    if(!ev.isFinal) {
	    	self.el.className = '';
            self.transform.translate = {
                x: self.START_X + ev.deltaX,
                y: self.START_Y + ev.deltaY
            };

            //if(self.transform.translate.x < movePostion.x) self.transform.translate.x = movePostion.x;
            //if(self.transform.translate.y < movePostion.y) self.transform.translate.y = movePostion.y;
            self.requestElementUpdate();

	    }
	},
	onPinch: function(ev){
		var self = ev.target.self;
	    if(ev.type == 'pinchstart') {
	        self.initScale = self.transform.scale || 1;
	    }
	    self.el.className = '';
	    self.transform.scale = self.initScale * ev.scale;
	    self.requestElementUpdate();
	},
	onRotate: function(ev) {
		var self = ev.target.self;
	    if(ev.type == 'rotatestart') {
	        self.startRotateAngle = ev.rotation ;
	        self.tempAngleFlag = 0 ;
	    }
	    if(ev.type == 'rotatemove'){
	        if(self.tempAngleFlag == 0){
	            self.preAngle = self.startRotateAngle;
	            self.tempAngleFlag ++;
	        }else{
	            self.deltaAngle = ev.rotation - self.preAngle;
	            self.el.className = '';
	            self.transform.rz = 1;  //非0  垂直xy轴
	            self.transform.angle = self.initAngle + self.deltaAngle;
	            self.requestElementUpdate();
	        }
	    }

	    //旋转结束  记录当前图片角度
	    if(ev.type =='rotateend'){
	        self.initAngle = self.transform.angle;
	    }
	},
	requestElementUpdate: function () {
		var self = this;
	    if(!self.ticking) {
	        self.reqAnimationFrame(self.updateElementTransform);
	        self.ticking = true;
	    }
	},
	updateElementTransform: function() {
		var self = this;
		if(!self.ticking) return;
	    var value = [
	                'translate3d(' + self.transform.translate.x + 'px, ' + self.transform.translate.y + 'px, 0)',
	                'scale(' + self.transform.scale + ', ' + self.transform.scale + ')',
	                'rotate3d('+ self.transform.rx +','+ self.transform.ry +','+ self.transform.rz +','+  self.transform.angle + 'deg)'
	    ];
	    value = value.join(" ");
	    self.ticking = false;
	    if(self.transform.scale >= 6) self.transform.scale = 6;
	    ugc.updateTransform(self.transform);
	},
	reqAnimationFrame: function(){
		var self = this;
		setInterval(function(){
			self.updateElementTransform();
		}, 30);
	},
	resetTransform: function(data){
		var self = this;
		self.START_X = data.x;
		self.START_Y = data.y;
		self.transform = {
	        translate: { x: self.START_X, y: self.START_Y },
	        scale: data.scale,
	        angle: data.angle,
	        rx: 0,
	        ry: 0,
	        rz: 0
	    };
	}


}







